<template>
    <div class="auth">
        <Header title="认证详情" >
            <img class="left" @click="back" src="../assets/turn.png" alt="">
        </Header>
        <div class="box_wrapper">
            <div class="box_flex">
                <p>所属楼栋：</p>
                <p>{{list.cellName}}{{list.unitName}}</p>
            </div>
            <div class="box_flex">
                <p>住户类型：</p>
                <p @click="actionSheet">{{household}}</p>
                <img class="box_black" src="../assets/down-black.png">
            </div>
            <div class="box_flex">
                <p>居住方式：</p>
                <p @click="open">{{live}}</p>
                <img class="box_black" src="../assets/down-black.png">
            </div>
            <div class="box_flex">
                <p>人员姓名：</p>
                <p>{{list.userName}}</p>
            </div>
            <div class="box_flex">
                <p>人员电话：</p>
                <p>{{list.mobile}}</p>
            </div>
            <div class="box_flex">
                <p>证件号码：</p>
                <p>{{list.cardNo}}</p>
            </div>
        </div>

        <div class="box_footer">
            <p class="old_repla" @click="error">拒绝</p>
            <p class="old_repla nut" @click="Success">通过</p>
        </div>
        <mt-actionsheet :actions="actions" v-model="sheetVisible"></mt-actionsheet>
        <mt-actionsheet :actions="json" v-model="flag"></mt-actionsheet>
    </div>
</template>

<script>
import Header from './header'
import { Toast, Indicator } from "mint-ui";
import { attestation, atteserror } from '../old_request'
export default {
    data(){
        return {
            list:[],
            sheetVisible:false,
            flag:false,
            total:{},
            household:'请选择住户类型',
            live:'请选择居住方式',
            actions:[
                {
                    name:'业主',
                    method:this.owner_one
                },
                {
                    name:'家属',
                    method:this.owner_two
                },
                {
                    name:'租客',
                    method:this.owner_sum
                }
            ],
            json:[
                {
                    name:'单身居住',
                    method:this.live_one
                },
                {
                    name:'合伙居住',
                    method:this.live_two

                },
                {
                    name:'家庭居住',
                    method:this.live_sum
                },
                {
                    name:'集体居住',
                    method:this.live_therr
                },
                {
                    name:'其他',
                    method:this.live_wu
                }
            ]
        }
    },
    components:{
        Header
    },
    methods:{
        back(){
            this.$router.back();                //返回上一页
        },
        owner_one(){
            this.household = '业主';
            this.total.type_firt = 'O';
        },
        owner_two(){
            this.household = '家属';
            this.total.type_firt = 'F';
        },
        owner_two(){
            this.household = '租客';
            this.total.type_firt = 'R';
        },
        actionSheet(){
            this.sheetVisible = true;
        },
        open(){
            this.flag = true;
        },
        live_one(){
            this.live = '单身居住';
            this.total.num = 1;
        },
        live_two(){
            this.live = '合伙居住';
            this.total.num = 2;
        },
        live_sum(){
            this.live = '家庭居住';
            this.total.num = 3;
        },
        live_therr(){
            this.live = '集体居住';
            this.total.num = 4;
        },
        live_wu(){
            this.live = '其他';
            this.total.num = 5;
        },
        Success(){
            let that = this;
            let data = {
                "sign":that.$md5(`${that.wrapper.globalData()}id=${that.list.id}timestamp=${that.wrapper.gettime()}`),
                "timestamp":that.wrapper.gettime(),
                "id":that.list.id,
                "mobile":that.list.mobile,
                "userId":that.wrapper.getlocalstoage('userid'),
                "userType":that.total.type_firt,
                "livingWay":that.total.num
            }
            if(that.total.type_firt === undefined){
                Toast({
                    message: "住户类型不能为空",
                    iconClass: "iconfont icon-cuowu",
                    duration: 1500
                });
                return false;
            }

            if(that.total.num === undefined){
                Toast({
                    message: "居住方式不能为空",
                    iconClass: "iconfont icon-cuowu",
                    duration: 1500
                });
                return false;
            }

            attestation(data,that).then( (res) => {
                console.log(res)
                if(res.code === 0){
                    Toast({
                        message: "认证成功",
                        iconClass: "iconfont icon-success_no_circle",
                        duration: 1500
                    });
                    setTimeout(function(){
                        that.$router.back();
                    },2000)
                }
            })
        },   
        error(){
            let that = this;
            let data = {
                "sign":that.$md5(`${that.wrapper.globalData()}id=${that.list.id}timestamp=${that.wrapper.gettime()}`),
                "timestamp":that.wrapper.gettime(),
                "id":that.list.id,
                "mobile":that.list.mobile,
                "userId":that.wrapper.getlocalstoage('userid')
            }
            atteserror(data,that).then( (res) => {
                console.log(res)
                if(res.code === 0){
                    Toast({
                        message: "操作成功",
                        iconClass: "iconfont icon-cuowu",
                        duration: 1500
                    });
                    setTimeout(function(){
                        that.$router.back();
                    },2000)
                }
            })
        }
    },
    created(){
        let that = this;
        that.list = that.$route.params.total
    }
}
</script>

<style scoped>
    .left{
        position: absolute;
        left: -6px;
        transform: translateY(1px) !important;
        height: 22px !important;
    }
    .box_wrapper{
        width: 90%;
        margin: 20px auto;
        background: rgb(211,211,205);
        border-radius:15px;
        padding: 10px 0px;
    }
    .auth{
        margin-top:85px;
    }
    .box_flex{
        display: flex;
        padding: 10px 20px;
        font-size: 18px;
        position: relative;
    }
    .box_flex .box_black{
        position: absolute;
        right: 15px;
    }
    .box_footer{
        display: flex;
        justify-content: center;
    }
    .box_footer .old_repla{
        width: 40%;
        height: 45px;
        line-height: 45px;
        text-align: center;
        border-radius: 50px;
        background: rgb(185,51,39);
        margin: 7px 10px;
        color: white;
        font-size: 18px;
    }
    .box_footer .nut{
        background: rgb(9,102,171) !important;
    }
</style>